<template>
  <div>
    <basic-container>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>产品配置</el-breadcrumb-item>
        <el-breadcrumb-item>渠道管理配置</el-breadcrumb-item>
      </el-breadcrumb>
    </basic-container>
    <basic-container>
      <avue-crud
        class="exclusive"
        :table-loading="loading"
        ref="crud"
        :data="data"
        v-model="form"
        :option="option"
        :page.sync="page"
        @on-load="getList"
        @refresh-change="refreshChange"
        @search-reset="from = {}"
        @search-change="searchChange"
        @row-update="rowUpdate"
        @row-save="rowSave"
      >
      <template slot="last" slot-scope="scope">
        {{ scope.row.edit_time }}
        <el-tag>{{ scope.row.edit_account_name }}</el-tag>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          size="small"
          @click.stop="bookDetail(scope)">
          书籍详情
        </el-button>
      </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { common } from "@/api/cat/httpRequest";
import { catUrl } from "@/config/env";

import { channelManage as baseURL, uploadFile } from "@/api/cat/baseUrls";

export default {
  data() {
    return {
      loading: false,
      page: {
        total: 0,
        pageSize: 10,
      },
      type: true,
      data: [],
      params: {},
      form: {},
      option: {
        index: true,
        excelBtn: false,
        border: true,
        dialogModal: true,
        tip: true,
        indexLabel: "编号",
        dialogClickModal: false,
        column: [
          {
            label: "渠道名称",
            prop: "channel_name",
            type: 'input',
            search: true
          },
           {
            label: "渠道id",
            prop: "channel_id",
            type: "input",
            search: true,
            addDisplay: false,
            editDisplay: false,
            addDisabled: false,
            editDisabled: false,
          },
          {
            label: "书籍id",
            prop: "book_ids",
            search: true,
            type: "textarea",
            span: 24,
            placeholder: "请填写书籍id配置(多id间用英文,号隔开 或 一行一个)",
            rules: [
              {
                required: true,
                message: "书籍id配置必须填写",
              },
            ],
          },
          {
            label: "最后操作信息",
            prop: "last",
            type: "input",
            addDisplay: false,
            editDisplay: false,
            addDisabled: false,
            editDisabled: false,
            readonly: true,
            slot: true,
          },
        ],
      },
    };
  },
  methods: {
    /**书籍详情 */
    async bookDetail(scope) {
      this.$router.push({ path: '/featuredFirst/channelManageBookinfo', query: {
        name: '渠道管理',
        id: scope.row.id,
      } })
    },

    /**获取列表 */
    async getList() {
      //清空表格列表
      this.data = [];
      //发送请求获取数据
      let response = await common(
        baseURL.page,
        { ...this.params },
        this.page,
        "POST"
      );
      this.page = response.page;
      this.data = response.data;
   
    },
    /**修改 */
    async rowUpdate(row, index, done, loading) {
      let userInfo = this.$store.state.user.userInfo;
      let data = {
        id: row.id,
        channel_name: row.channel_name,
        preference: row.preference,
        book_ids: row.book_ids,
        edit_account_id: userInfo.id,
        edit_account_name: userInfo.username,
      }
      let res = await common(baseURL.update, data, null, "PUT");
      if (res == null) {
        loading();
        return;
      }
      this.getList();
      done();
    },
    /**新增 */
    async rowSave(row, done, loading) {
      delete row["id"];
      let userInfo = this.$store.state.user.userInfo;
      row.edit_account_id = userInfo.id;
      row.edit_account_name = userInfo.username;
      row.book_ids = row.book_ids.split(',')
      let data = await common(baseURL.add, row, null, "POST");
      if (data == null) {
        loading();
        return;
      }
      this.getList();
      done();
    },
    /**删除 */
   
    /**刷新 */
    refreshChange() {
      this.getList();
    },
    /**搜索 */
    searchChange(params, done) {
      this.params = params;
      this.page.currentPage = 1;
      this.getList();
      if (done) done();
    },
  },
};
</script>